<template>
  <div>
	
	<myheader></myheader>
	<!-- 面包屑导航 -->
	<Breadcrumb :datas = 'datas'></Breadcrumb>

	<section class="featured-block text-center">
		<div class="container">
			<table>
				<tr>
					<td style="padding:5px;">
						名称：
					</td>
					<td style="padding:5px;">
						<input type="text" v-model="title">
					</td>
				</tr>
				<tr>
					<td style="padding:5px;">
						链接：
					</td>
					<td style="padding:5px;">
						<input type="text" v-model="link">
					</td>
				</tr>
				<tr>
					<td style="padding:5px;">
						图片上传：
					</td>
					<td style="padding:5px;">
						<input type="file" @change="upload">
					</td>
				</tr>
				<tr>
					<td style="padding:5px;">
						
					</td>
					<td style="padding:5px;">
						<Button @click="submit" color='blue'>提交</Button>
					</td>
				</tr>
			</table>
		</div>
	</section>
	
	<myfooter></myfooter>
    
  </div>
  
</template>


 
<script>

// 导包
import myheader from './myheader'
import myfooter from './myfooter'
import { config } from '../config'

export default {
  data () {
    return {
	  msg: "这是一个变量",
	  // 声明面包屑导航
	  datas: [{title: '首页', route: {name: 'index'}}, {title: '幻灯片页'}],
	  
    }
  },

  // 注册组件
  components: {
	  'myheader': myheader,
	  'myfooter': myfooter,
	  
  },

  mounted:function(){
	  
  },
  
  methods:{
	  // 提交
	  submit(){
          this.axios({
            url:"http://localhost:8000/insertpics/",
            params: {
			  title: this.title,
			  link: 'http://localhost:8000/static/upload/' + this.src,
			  img: this.src
            }
          }).then(res => {
            this.$Message(res.data.message)
          })
        
	  },

	  // 上传头像
	  upload: function (e) {
		// 获取文件对象
		let file = e.target.files[0];

		// 声明参数
		let param = new FormData();

		// 添加文件
		param.append('file', file, file.name);

		// 声明请求头
		let config = {headers: {'Content-Type': 'multipart/form-data'}};

		// 发送请求
		this.axios.post('http://127.0.0.1:8000/uploadfile/', param, config)
		.then((result) => {
			console.log(result);

			// 赋值操作
			this.src = 'http://127.0.0.1:8000/static/upload/' + result.data.filename;
		}) 
	}
     
  }
}


</script>
 
<style>



</style>